<!--
 * @Description: 
 * @Date: 2021-01-06 10:48:54
 * @LastEditors: lother
 * @LastEditTime: 2021-01-06 11:39:11
 * @FilePath: \AccountOpening-H5\src\components\bankCard.vue
-->
<template>
     <van-field
          v-model="bankCard"
          :name="$t('login.index.5638rk3g0080')+title"
          :label="title"
          required
          :placeholder="$t('login.index.5638rk3g0080')+title"
          clearable
          :rules="rulesList"
        />
</template>
<script>
export default {
    props:{
        val:{
            type:[String],
            default:()=>''
        },
        title:{
            type:String,
            default:()=>''
        },
        required:{
            type:Boolean,
            dafault:()=>false
        }
    },
    computed:{
        rulesList(){
            if(this.required){
                return [{ required: true, message:this.$t('login.index.5638rk3g0080')+this.title }]
            }else{
                return []
            }
        },
        bankCard:{
            get(){
                return this.val.replace(/\D/g,'').replace(/....(?!$)/g,'$& ');
            },
            set(val){
                var value  = val.replace(/\s*/g,"")
                this.$emit('update:val',value)
            }
        }
    },
    data() {
        return {
            // bankCard:""
        }
    },
    created(){
    },
}
</script>